<template>
  <dynamic-table ref="tableRef" :columns="columns" :page-option="{type: 1}" :get-list-func="permissionList" rowKey="id" :row-selection="rowSelection">
    <template v-slot:title>
      <a-button v-permission="{ action: 'permissioninfo:add', effect: 'disabled'}" @click="addItem" type="primary">
        添加
      </a-button>
<!--      <a-button @click="deleteItems" :disabled="isDisabled" type="primary">-->
<!--        删除-->
<!--      </a-button>-->
    </template>
  </dynamic-table>
</template>
<script lang="ts">
import {defineComponent, reactive, toRefs, createVNode, computed, ref} from 'vue'
import {Modal} from 'ant-design-vue'
import {QuestionCircleOutlined} from '@ant-design/icons-vue'
import DynamicTable from '@/components/dynamic-table.vue'
import { useCreateModal} from "@/hooks"
import {permissionList, permissionDelete} from '@/api/role/permission'
import AddModal from './add-modal.vue'
import {formatDate} from "@/utils/common"
import {columns} from "./columns"
import {hasPermission} from "@/utils/hasPermission"

export default defineComponent({
  name: 'permission',
  components: {
    DynamicTable
  },
  setup() {
    const tableRef = ref<any>(null)

    const state = reactive({
      data: [],
      uploading: false,
      tableLoading: false,
      rowSelection: {
        onChange: (selectedRowKeys, selectedRows) => {
          state.rowSelection.selectedRowKeys = selectedRowKeys
        },
        selectedRowKeys: []
      },
    })



    // 删除多项
    const deleteItems = () => {
      Modal.confirm({
        title: '提示',
        icon: createVNode(QuestionCircleOutlined),
        content: '您确定要删除所有选中吗？',
        onOk: async () => {
          await permissionDelete({"ids": state.rowSelection.selectedRowKeys})
          tableRef.value.refreshTableData()
          state.rowSelection.selectedRowKeys = []
        }
      })
    }
    // 添加策略
    const addItem = () => {
      useCreateModal(AddModal, {
        callback: () => {
          tableRef.value.refreshTableData()
        }
      })
    }
    const isDisabled = computed(() => state.rowSelection.selectedRowKeys.length == 0 && hasPermission('role:delete'))

    return {
      ...toRefs(state),
      columns,
      tableRef,
      formatDate,
      permissionList,
      isDisabled,
      addItem,

      deleteItems,
    }
  }
})
</script>
